
#post-toc-menu
  display: block
  position: fixed
  top: $menu-top + $menu-size + 1px
  right: $menu-right
  z-index: 30
  width: $menu-size
  height: $menu-size
  padding: 0
  background: transparent
  border: none
  border-radius: 2px
  outline: none
  overflow: hidden
  cursor: pointer
  &-icons
    display: block
    width: 200%
    height: $menu-size
    margin-left: -100%
    font-size: 24px
    line-height: $menu-size
    color: #fff
    background: $sidebar-bg
    overflow: hidden
    @extend %icon
    &:before
      @extend %icon-list
      float: left
      width: 50%
    &:after
      @extend %icon-list
      float: left
      width: 50%

#post-toc
  width: $post-toc-width
  height: 100%
  padding-top: 10px
  position: fixed
  top: $menu-top + $menu-size + $menu-size + 2px
  bottom: 0
  right: -$post-toc-width
  z-index: 30
  background: transparentize($post-toc-bg, 0.1)
  border-top: 1px solid $post-toc-border-color
  border-left: 1px solid $post-toc-border-color
  border-radius: 10px 0 0 0
  display: block
  overflow-y: scroll
  -webkit-user-select: none
  -moz-user-select: none
  -ms-user-select: none
  -o-user-select: none
  user-select: none
  transition: transform .35s $time-function
  &.open
    transform: translateX(-100%)

#post-toc-title
  padding: 0 0 5px 11px
  color: $post-toc-title-color
  font-size: 1em
  display: block

#post-toc-ul
  margin: 0
  padding: 0 10px 20px 15px
  line-height: 1.6

.post-toc-li
  color: $post-toc-li-color
  white-space: nowrap
  text-overflow: ellipsis
  display: block
  overflow: hidden
  > a
    color: inherit
    text-decoration: none
  > a:hover
    color: $post-toc-hover-color

.post-toc-h1
  font-size: 1em
  list-style: none

.post-toc-h2
  font-size: .95em

.post-toc-h3
  margin-left: 12px
  font-size: .9em
  & + .post-toc-h2
    padding-top: .25em